<template name="card">
	<view class="block">
		<view class="frist">
			<view>{{reciveAllzhao.workName}}</view>
			<view class="red">{{reciveAllzhao.salary}}</view>
		</view>
		<view class="secend">
				<view>{{reciveAllzhao.cityName}}</view>
<!-- 				<view>|</view>
				<view>22届毕业</view> -->
				<view>|</view>
				<view>{{reciveAllzhao.eduReq}}</view>
		</view>
		<!-- 标签 -->
		<view class="third">
			<view v-for="(item,index) in tags" :key="index">
				<view class="fenlei">{{item}}</view>
			</view>
		</view>
		
		<view class="gongsi">
			<image class="logo" :src="reciveAllzhao.companyIcon"></image>
			<view class="width">
				<view>{{reciveAllzhao.companyName}}</view>
				<view class="information">
<!-- 					<view>已上市</view>
					<view>|</view>
					<view>互联网/软件</view>
					<view>|</view>
					<view>200人以上</view> -->
					<view>{{reciveAllzhao.companyIntro}}</view>
				</view>
			</view>
			<image class="collection" src="../static/shoucang-no.png" v-show="showUpImg" @click="changeImg" mode="heightFix"></image>
			<image class="collection" src="../static/shoucang-y.png" v-show="!showUpImg" @click="changeImg" mode="heightFix"></image>
			
		</view>
		
	</view>

</template>

<script>
	
	export default {
		name:"card",
		props:["reciveAllzhao"],
		data() {
			return {
				tags:[],
				showUpImg:true,
			}
		},
		created() {
			this.tags=this.reciveAllzhao.tags;
			console.log('标签',this.reciveAllzhao.tags)
		},

		methods: {
			changeImg:function(){
				this.showUpImg = !this.showUpImg
			}
		}
	}
</script>

<style>
	
.block{
	position:relative;//定位方式,相对定位
	margin: 5rpx 25rpx 25rpx 25rpx;
	border-radius: 25rpx;
	border: 1px solid #e6e6e6;
	height: 200rpx;
	padding: 3%;
	background-color: #FFFFFF;
}
.frist{
	display: flex;
	flex-direction: row;
	justify-content:space-between;
	font-weight: bold;
	font-size: small;
}

.secend{
	margin-top: 10rpx;	
	width: 60%;
	display: flex;
	flex-direction: row;	
	font-size: small;
}

.third{
	height: 30rpx;
	margin-top: 10rpx;
	display: flex;
	flex-direction: row;
	font-size: small;
}
.fenlei{
	width: 80rpx;
	margin-right: 20rpx;
	border-radius: 10rpx;
	background-color: #e6e6e6;
	color: #8a8a8a;
	display: block;//块的形式让文字居中
	text-align: center;
	font-size: smaller;
}
.red{
	font-size: small;
	color: red;
	margin-right: 20rpx;
}
.gongsi{
	margin-top: 15rpx;
	display: flex;
	flex-direction: row;
	font-size: small;
}
.information{
	display: flex;
	flex-direction: row;
	color: #8a8a8a;
}
.logo{
	width: 75rpx;
	height: 75rpx;	
	margin-right: 20rpx;
}
.width{
	width: 75%
}
.collection{
	position:relative;
	margin-top: 10rpx;
	height: 50rpx;
}
</style>
